/*
 * Created by weishuwen on 2015/3/16.
 *
 * html样式片段不能加空格
 */


UE.plugins["editstyle"] = function() {
    var me = this;
    var dialog = null;
    var COMMAND = {
        editone: 0,
        edittwo: 1,
        editthree: 2,
        editfour: 3,
        editfive: 4,
        editsix: 5,
        editseven: 6,
        editeight: 7
    };
    /**
     *     execCommand(cmdName, dialog): 点击toolbar，调用插件，大部分逻辑都在这里写
     *     queryCommand(cmdName, dialog): 状态处理
     *     baidu.editor.ui.Dialog: 是否使用弹出层，注意：dialog关闭后其中的内容会清除，但dialog本身不会从dom移除
     *         title: 标题,默认同description
     *         content: 内容
     */
    // me.addListener("click", function (type, event) {
    //   editor.selection.getText();
    // });

    me.commands["editone"] = {
        execCommand: function(cmd) {
            // 判断是否要绑定事件
            var flag = true;
            if (!dialog) {
                dialog = new baidu.editor.ui.Dialog({
                    title: '特殊模板',
                    ///content: $("#styleDialog").html(),
                    content: styleDialog.render({}),
                    draggable: true,
                    editor: this
                });
                flag = false;
                dialog.open(); // 打开对话框
            } else {
                dialog._show(); //直接显示出来，防止用open时候重新渲染
            }

            var node = $(dialog.getDom());

            switchTab(node.find('.style-nav a'), node.find('.style-section'), COMMAND[cmd]); // 默认显示的

            if (flag) {
                return;
            }

            node.on('click', '.style-nav a', function() {
                /**
                 * 对话框头部导航事件绑定
                 */
                switchTab(node.find('.style-nav a'), node.find('.style-section'), $(this).index());

                return false;
            }).on('click', 'ul li', function() {
                /**
                 * 内容区域块的选项绑定
                 */
                var element = $(this);
                var root = element.parents('.style-section');
                var text = root.find('.style-footer-text');

                text.html(element.html());

                return false;
            }).on('click', '.style-footer a', function() {
                /**
                 * 对话框确定按钮的绑定
                 */
                var element = $(this);
                var html = element.parent().find('.style-footer-text').html();

                //console.log((html));

                try {
                    me.execCommand('insertHtml', html);
                } catch (e) {

                } finally {
                    dialog.close();
                }
                /*node.off('click').remove();*/
            });

            node.find('.colorpicker').each(function() {
                //$(this).farbtastic()
                var $_this = $(this);
                $_this.farbtastic(function() {
                    var _this = this;
                    var text = $_this.parents('.style-section').find('.style-footer-text');
                    var color = $_this.siblings('.color');
                    var modify = text.find('[class$="color"]');
                    // 设置input的内容
                    color.css({ "border-color": _this.color }).val(_this.color);
                    // 当前选择项目查找样式值以及改变颜色
                    modify.each(function(index, value) {
                        var className = $(this)[0].className; //允许多个class
                        var style = $(this)[0].style;
                        var names = className.split(" ");

                        $.each(names, function(index, value) {
                            if ("brcolor" == value) {
                                style.borderColor = _this.color;
                            }
                            if ("bkcolor" == value) {
                                style.backgroundColor = _this.color;
                            }
                            if ("bfcolor" == value) {
                                style.color = _this.color;
                            }
                        });
                    });
                });
            });
            node.find('#tableOK').on('click', function() {
                var line = $('#lineNum');
                var row = $('#rowNum');
                var foot_table = $('#footer_table_text');
                var result = foot_table.find('table');
                var lineNum = parseInt(line.val());
                var rowNum = parseInt(row.val());
                var tableHtml = '';
                if (lineNum< 3 || rowNum < 3) {
                    alert("输入行数列数不能少于3");
                    line.val('3');
                    row.val('3');
                } else {
                    switch (result.attr('data_style')) {
                        case 'horizontal':
                            var style1 = result.find('td').eq(0).prop("outerHTML").toString();//头部样式
                            var style2 = result.find('tr').eq(1).find('td').eq(0).prop("outerHTML").toString();//主体样式
                        
                            for (var i = 0; i < lineNum; i++) {
                                tableHtml = tableHtml+'<tr>'
                                for (var j = 0; j < rowNum; j++) {
                                   if(i==0){
                                    tableHtml = tableHtml + style1;
                                   }
                                   else  tableHtml = tableHtml + style2;
                                }
                                tableHtml = tableHtml + '</tr>';
                            }
                            tableHtml = '<div class="ycf-editor-item" style="padding:30px 0 20px 0"><table style="width:100%" data_style="horizontal"><tbody>'+tableHtml+"</tbody></table></div>";
                            break;
                        case 'vertical':
                            var style1 = result.find('td').eq(0).prop("outerHTML").toString();//头部样式
                            var style2 = result.find('td').eq(1).prop("outerHTML").toString();//主体样式
                            
                            for (var i = 0; i < lineNum; i++) {
                                tableHtml = tableHtml+'<tr>'
                                for (var j = 0; j < rowNum; j++) {
                                   if(j==0){
                                    tableHtml = tableHtml + style1;
                                   }
                                   else  tableHtml = tableHtml + style2;
                                }
                                tableHtml = tableHtml + '</tr>';
                            }
                            tableHtml = '<div class="ycf-editor-item" style="padding:30px 0 20px 0"><table style="width:100%" data_style="vertical"><tbody>'+tableHtml+"</tbody></table></div>";
                            break;
                        }
                        foot_table.html(tableHtml);
                }
            });

            /**
             * 导航事件
             * @param nav
             * @param content
             * @param index 当前索引
             */
            function switchTab(nav, content, index) {
                nav.eq(index).addClass('active').siblings().removeClass('active');
                content.hide().eq(index).fadeIn();
            }
        }
    };
};
